@charset "utf-8";
table {
    border-collapse: inherit;
}

#wrap {
    margin-top: 5px;
}

#kalendar {
    width: 100%;
    border-radius: 4px;
    border: solid 1px #ccc;
    box-shadow: 2px 2px 9px #ccc;
}

/*@media(max-width:1320px) {
	#kalendar {
		width: 360px;
		border-radius: 4px;
		border: solid 1px #ccc;
		box-shadow: 2px 2px 9px #ccc;
	}
}*/

/* 选择年月 的行 */

#kalendar tr#select {
    height: 40px;
}

#kalendar tr#select td {
    clear: both;
}

#kalendar tr#select td div {
    float: left;
    width: 160px;
    height: 30px;
    line-height: 30px;
}

#kalendar tr#select #year,
#kalendar tr#select #month {
    width: 80px;
    padding-left: 20px;
}

#select #year ul,
#select #month ul {
    clear: both;
}

#select #year ul li,
#select #month ul li {
    float: left;
    width: 30px;
}

#select #year ul li input,
#select #month ul li input {
    width: 30px;
    text-align: 30px;
    cursor: pointer;
}

#select #year ul li.selectChange,
#select #month ul li.selectChange {
    width: 70px;
    height: 10px;
}

#select #year ul li.selectChange select,
#select #month ul li.selectChange select {
    width: 80px;
    padding-left: 2px;
    cursor: pointer;
    border: none;
}

#select #year ul li.selectChange select option,
#select #month ul li.selectChange select option {
    padding-left: 5px;
}


/* 星期表头 的行 */

#kalendar tr#week {
    height: 40px;
}

#kalendar tr#week td ul {
    clear: both;
    overflow: hidden;
}

#kalendar tr#week td ul li {
    float: left;
    width: 14.28%;
    height: 40px;
    line-height: 40px;
    text-align: center;
    border-top: 1px solid #b3b3b3;
    border-bottom: 1px solid #b3b3b3;
    background: #f4f7fa;
}

/*@media(max-width:1320px) {
	#kalendar tr#week td ul li {
		float: left;
		width:51px;
		height: 40px;
		line-height: 40px;
		text-align: center;
		border-top: 1px solid #b3b3b3;
		border-bottom: 1px solid #b3b3b3;
		background: #f4f7fa;
	}
}*/


/* 某月具体日期 的每一行 */

#kalendar tr#day ul.dayList {
    height: 42px;
    clear: both;
    margin: 2px auto;
}

/*@media(max-width:1320px) {	
	#kalendar tr#day ul.dayList {
		height: 42px;
		clear: both;
		margin: 2px auto;
		width: 336px;
	}
}*/
#kalendar tr#day ul.dayList li {
    float: left;
    width: 14.28%;
    height: 40px;
    line-height: 40px;
    text-align: center;

    background: #f4f7fa;

    pointer-events: none;
}

.geshi {
    height: 100%;
    width: 100%;
    line-height: 38px;
    text-align: center;
    background: #f4f7fa;
    border-radius: 4px;
    border: 1px solid #ccc;
}

@media (max-width: 992px) {
    #kalendar tr#day ul.dayList li {
        float: left;
        width: 13.7%;
        height: 40px;
        line-height: 40px;
        text-align: center;
        margin: 0 2px;
        background: #f4f7fa;
        cursor: pointer;
        border-radius: 4px;
        border: 1px solid #ccc;
    }
}

@media (max-width: 768px) {
    #kalendar tr#day ul.dayList li {
        float: left;
        width: 13.6%;
        height: 40px;
        line-height: 40px;
        text-align: center;
        margin: 0 2px;
        background: #f4f7fa;
        cursor: pointer;
        border-radius: 4px;
        border: 1px solid #ccc;
    }
}

@media (max-width: 730px) {
    #kalendar tr#day ul.dayList li {
        float: left;
        width: 13.6%;
        height: 40px;
        line-height: 40px;
        text-align: center;
        margin: 0 2px;
        background: #f4f7fa;
        cursor: pointer;
        border-radius: 4px;
        border: 1px solid #ccc;
    }
}

@media (max-width: 714px) {
    #kalendar tr#day ul.dayList li {
        float: left;
        width: 13.5%;
        height: 40px;
        line-height: 40px;
        text-align: center;
        margin: 0 2px;
        background: #f4f7fa;
        cursor: pointer;
        border-radius: 4px;
        border: 1px solid #ccc;
    }
}

@media (max-width: 630px) {
    #kalendar tr#day ul.dayList li {
        float: left;
        width: 13.5%;
        height: 40px;
        line-height: 40px;
        text-align: center;
        margin: 0 2px;
        background: #f4f7fa;
        cursor: pointer;
        border-radius: 4px;
        border: 1px solid #ccc;
    }
}

@media (max-width: 600px) {
    #kalendar tr#day ul.dayList li {
        float: left;
        width: 13.4%;
        height: 40px;
        line-height: 40px;
        text-align: center;
        margin: 0 2px;
        background: #f4f7fa;
        cursor: pointer;
        border-radius: 4px;
        border: 1px solid #ccc;
    }
}

@media (max-width: 558px) {
    #kalendar tr#day ul.dayList li {
        float: left;
        width: 13.3%;
        height: 40px;
        line-height: 40px;
        text-align: center;
        margin: 0 2px;
        background: #f4f7fa;
        cursor: pointer;
        border-radius: 4px;
        border: 1px solid #ccc;
    }
}

@media (max-width: 500px) {
    #kalendar tr#day ul.dayList li {
        float: left;
        width: 13.2%;
        height: 40px;
        line-height: 40px;
        text-align: center;
        margin: 0 2px;
        background: #f4f7fa;
        cursor: pointer;
        border-radius: 4px;
        border: 1px solid #ccc;
    }
}

@media (max-width: 458px) {
    #kalendar tr#day ul.dayList li {
        float: left;
        width: 12.9%;
        height: 40px;
        line-height: 40px;
        text-align: center;
        margin: 0 2px;
        background: #f4f7fa;
        cursor: pointer;
        border-radius: 4px;
        border: 1px solid #ccc;
    }
}

@media (max-width: 340px) {
    #kalendar tr#day ul.dayList li {
        float: left;
        width: 12.9%;
        height: 40px;
        line-height: 40px;
        text-align: center;
        margin: 0 2px;
        background: #f4f7fa;
        cursor: pointer;
        border-radius: 4px;
        border: 1px solid #ccc;
    }
}

/*@media(max-width:1320px) {
	#kalendar tr#day ul.dayList li {
		float: left;
		width: 44px;
		height: 40px;
		line-height:40px;
		text-align: center;
		margin: 0 2px;
		background: #f4f7fa;
		cursor: pointer;
		border-radius: 4px;
		border: 1px solid #ccc;
	}
}*/
#kalendar tr#day ul.dayList .null {
    background: #FFF;
    border: 1px solid #FFF;
}

#kalendar tr#day ul.dayList .choose {
    background: url(../images/no_pic.png) no-repeat center center;
}

#kalendar tr#day ul.dayList .choose1 {
    background: url(../images/yes_pic.png) no-repeat center center;
}

#kalendar tr#day ul.dayList .no_practice {
    color: #FF0000;
    background: #fff;
}


/* 日期占用行数(4-6行)，将不需要显示的行隐藏 */

#kalendar tr#day ul.hide {
    display: none;
}


/* 周末 的特殊样式 */

#week .weekend,
#day .weekend {
}


/* 下面几个样式注意顺序，选择器不能简写，否则日历中 今天 的样式会被鼠标滑过的样式替换 */


/* 鼠标经过某个日期 的特殊样式 */

#kalendar tr#day td ul.dayList li.mouseFloat {
    background: #FFDCB9;
}


/* 当天是周末 的特殊样式 */

#kalendar tr#day td ul.dayList li.todayWeekend {
    color: #EA0000;
    background: #abcdef;
    font-weight: 700;
}


/* 当天 的特殊样式 */

#kalendar tr#day td ul.dayList li.today {
}